import React, { useState, useEffect } from 'react'
import { View, Image, Text } from '@tarojs/components'
import { network } from '@/utils/network'
import Taro, { useDidShow } from '@tarojs/taro'
import { ButtonEle } from '@/components/Buttton'
import { Empty } from '@/components/Empty'
import Address from './components/Address'
import './index.scss'

export default () => {
  const [addressList, setAddressList] = useState([])
  const [empty, setEmpty] = useState(false)
  const getData = () => {
    network.get('/xxm/address/list').then((res) => {
      setAddressList(res.data)
      if (res.data.length === 0) {
        setEmpty(true)
      } else {
        setEmpty(false)
      }
    })
  }
  useDidShow(() => {
    getData()
  })
  return (
    <View className='xxm-address'>
      {addressList.map((item: any) => (
        <View
          key={item.id}
          className='address-container'
          onClick={() => {
            const { id, address_detail, address_description, mobile, name,  } = item;
            const params = `id=${id}&address=${address_detail + address_description}&mobile=${mobile}&name=${name}`;
            Taro.navigateTo({ url: `/pages/checklist/checklist/index?${params}` });
          }}
        >
          <Address address={item}></Address>
        </View>
      ))}
      {
        empty && <Empty img="http://xmmi.oss-cn-beijing.aliyuncs.com/icon/no-data.png"
          desc="暂无收货地址，请添加"
        />
      }
      <View className='footer'>
        <ButtonEle
          block
          type='primary'
          onClick={() => Taro.navigateTo({ url: '/pages/me/addressDetail/index' })}
        >
          添加地址
        </ButtonEle>
      </View>

    </View>
  )
}
